<template>
    <div id="app">
        <el-container>
            <el-header>
                <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
                    <el-menu-item index="Index">主页</el-menu-item>
                    <el-menu-item index="Users">用户管理</el-menu-item>
                    <el-menu-item index="3">消息中心</el-menu-item>
                    <el-menu-item index="4">订单管理</el-menu-item>
                </el-menu>
            </el-header>

            <el-main>
                <router-view />
            </el-main>
        </el-container>


    </div>
</template>

<script>
export default {
    name: 'App',
    data() {
        return {
            router: true,
            activeIndex: 'Index',
        };
    },
    methods: {
        handleSelect(key, keyPath) {
            console.log(key, keyPath);
            this.$router.push({ name: keyPath });
        }
    },
}
</script>

<style></style>
